<script setup>
import { ref, computed, watch } from 'vue';
import { onLoad, onShow, onHide, onUnload } from '@dcloudio/uni-app';
import { useAppStore } from '@/store/modules';
import { getIsOpen } from "@/utils/site";
import config from '@/config/config';
let upgradeTime = ref('');
const appStore = useAppStore();
const siteInfo = computed(() => {
  return appStore.siteInfo;
})
let isUpgrade = '';
upgradeTime.value = siteInfo.upgradeTime;
watch(siteInfo, (newVal, oldVal) => {
  isUpgrade = getIsOpen(siteInfo.value);
  if (!isUpgrade) {
    uni.switchTab({ url: config.page.index })
  }
});

onUnload(() => {
  console.log('离开当前页面-onunload')
  wx.reLaunch({
    url: '/user-enter/upgrade/index',
  })
});
onHide(() => {

  console.log('离开当前页面-onhide')
  if (isUpgrade) {
    wx.reLaunch({
      url: '/user-enter/upgrade/index',
    })
  }

});
</script>
<template>
  <div class="wrap" style="text-align: center;margin-top: 100px;">
    <i class="icon iconfont ai-icon-update" style="font-size: 100px;" />
    <!-- <img src="upgrade.png" alt="Upgrade" style="width: 100px; height: 100px;"> -->
    <h1>系统正在升级中</h1>
    <p>预计升级时间完成时间:</p>
    <p id="time">
      {{ siteInfo.upgradeTime }}
    </p>
    <p>请耐心等待~</p>
  </div>
</template>

<style>
.wrap {
  line-height: 2;
  color: grey;
}

.ai-icon-update {
  /* color: var(--a-color); */
  animation: flash 3s linear infinite;

}

#time {
  color: var(--a-one-text-color);
}

@keyframes flash {

  0%,
  50%,
  100% {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}

body {
  background-color: #f2f2f2;
  font-family: Arial, sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}

img {
  margin-bottom: 20px;
}

h1 {
  font-size: 36px;
  color: #333;
}

p {
  font-size: 18px;
  color: #666;
}
</style>
